<template>
  <div class="register">
    <img class="reguster_logo" src="../assets/reguster_logo2.png" alt />
    <input v-model="mobile" class="reguster_input" placeholder="代号" type="text" />
    <div class="reguster_text" @click="login">下一步</div>
  </div>
</template>

<script>
export default {
  name: "register",
  components: {},
  data() {
    return {
      mobile: ""
    };
  },
  methods: {
    login() {
      layer.open({
        type: 2,
        content: "加载中"
      });
      try {
        this.$api.user.login({ mobile: this.mobile }).then(res => {
          layer.closeAll("iframe");
          if (res.error == 0) {
            localStorage.setItem("name", res.data.name);
            localStorage.setItem("access_token", res.data.access_token);
            this.$router.replace("/");
          }
          layer.open({
            content: res.msg,
            skin: "msg",
            time: 2 //2秒后自动关闭
          });
        });
      } catch (e) {
      }
    }
  }
};
</script>


<style lang="less" scoped>
.register {
  overflow: hidden;
  width: 100%;
  height: 100vh;
  background: #0a0723;
  display: flex;
  flex-direction: column;
  align-items: center;
  .reguster_logo {
    margin-top: 20%;
    width: 80%;
  }
  .reguster_input {
    margin-top: 20%;
    border-radius: 2rem 2rem;
    width: 80%;
    height: 2.5rem;
    box-shadow: none; /*去除阴影*/
    outline: none; /*聚焦input的蓝色边框*/
    resize: none; /*textarea 禁止拖拽*/
    border: none; /*去除边框*/
    -webkit-appearance: none; /*常用于IOS下移除原生样式*/
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); /*点击高亮的颜色*/
    text-align: center;
    font-size: 1rem;
  }
  .reguster_text {
    margin-top: 30%;
    color: white;
    font-size: 1.2rem;
  }
}
</style>
